import React, { PureComponent } from 'react';
import { connect } from 'dva';
import {
  Form,
  Input,
  DatePicker,
  Select,
  Button,
  Card,
  InputNumber,
  Radio,
  Modal,
} from 'antd';
const FormItem = Form.Item;

@connect(({loginPolicy, loading }) => ({
  loginPolicy,
  loading: loading.models.loginPolicy,
}))

@Form.create()
class LoginPolicy extends PureComponent {
  handleSubmit = e => {
    const { dispatch, form } = this.props;
    e.preventDefault();
    form.validateFieldsAndScroll((err, values) => {
      if (!err) {
        this.update(values)
      }
    });
  };

    // 提交
  update(e) {
    const { dispatch } = this.props;
    const values = {
     enableVerifiCode: parseInt(e.enableVerifiCode),
     verifiFailTime: e.enableVerifiCode==2?parseInt(e.verifiFailTime):'',
     failTimes: parseInt(e.failTimes),
     failDeal: parseInt(e.failDeal),
     lockTime: parseInt(e.failDeal)==0?parseInt(e.lockTime):'',
    };

    dispatch({
      type: 'loginPolicy/update',
      payload: values,
      callback: (res) => {
        if(res.result == "ok") {
          Modal.success({title: res.msg});
          this.pageList();
        }else {
          Modal.error({title: '操作失败',content: res.msg});
        }
      },
    });
  }

  // 查询
  pageList() {
    const { dispatch } = this.props;
    dispatch({
      type: 'loginPolicy/queryList',
    });
  }

  componentDidMount() {
    this.pageList();
  }

  render() {
    const {
      form: { getFieldDecorator, getFieldValue }, 
      submitting , 
      loginPolicy: { data }
    } = this.props;

    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 7 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 12 },
        md: { span: 10 },
      },
    };

    const submitFormLayout = {
      wrapperCol: {
        xs: { span: 24, offset: 0 },
        sm: { span: 10, offset: 7 },
      },
    };
    const dataG = JSON.stringify(data);
    return (
      <Card bordered={false}>
        <Form onSubmit={this.handleSubmit} hideRequiredMark style={{ marginTop: 8 }}>
          <FormItem {...formItemLayout} label="验证码：">
            <div>
              {getFieldDecorator('enableVerifiCode', {
                initialValue: dataG!='{}' && data.enableVerifiCode,
              })(
                <Radio.Group>
                  <Radio value={1}>一直启用</Radio>
                  <Radio value={0}>一直不启用</Radio>
                  <Radio value={2}>超过登录失败次数</Radio>
                </Radio.Group>
              )}
              <FormItem style={{display: getFieldValue('enableVerifiCode') === 2 ? 'block' : 'none',
              }}>
                <span className="ant-form-text">登录失败</span>
                {getFieldDecorator('verifiFailTime',{initialValue: dataG!='{}'&&data.verifiFailTime})(
                  <InputNumber min={1} max={10}/>)}
                <span className="ant-form-text">次后启用</span>
              </FormItem>

            </div>
          </FormItem>

          <FormItem {...formItemLayout} label="帐号锁定：">
            <span className="ant-form-text">登录失败</span>
            {getFieldDecorator('failTimes',{initialValue: dataG!='{}'&&data.failTimes})(
              <InputNumber min={1} max={10}/>)}
            <span className="ant-form-text">次锁定帐号</span>
          </FormItem>

          <FormItem {...formItemLayout} label="自动解锁：">
            <div>
              {getFieldDecorator('failDeal', {
                initialValue:  dataG!='{}'&&data.failDeal,
              })(
                <Radio.Group>
                  <Radio value={0}>是</Radio>
                  <Radio value={1}>否</Radio>
                </Radio.Group>
              )}
              <FormItem style={{display: getFieldValue('failDeal') === 0 ? 'block' : 'none',
              }}>
                {getFieldDecorator('lockTime',{initialValue:  dataG!='{}'&&data.lockTime})(
                  <InputNumber min={0}/>)}
                <span className="ant-form-text">天后自动解锁</span>
              </FormItem>
            </div>
          </FormItem>

          <FormItem {...submitFormLayout} style={{ marginTop: 32 }}>
            <Button type="primary" htmlType="submit" loading={submitting}>
              提交
            </Button>
            {
            // <Button style={{ marginLeft: 8 }} onClick={this.handleFormReset}>
            //     重置
            // </Button>
            }
          </FormItem>
        </Form>
      </Card>
    );
  }
}

export default LoginPolicy;
